<template>
	<view>
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="backText">返回</block>
			<!-- <block slot="content">资讯详细</block> -->
		</cu-custom>
		<view class="topicdetail">
			<div class="header">
				<h2 class="title">{{title}}</h2>
				<!-- <h3 class="summary">{{summary}}</h3> -->
				<div class="time"><uni-dateformat :date="updateTime" format="yyyy/MM/dd hh:mm"></uni-dateformat></div>
			</div>
			<div class="content">
				<div v-if="topicdetaillength != 0" class="detail" v-html="replace(details)">
					<jyf-parser :html="details" ref="article"></jyf-parser>
				</div>
				<div v-else style="text-align: center;"></div>
			</div>
		</view>
	</view>
</template>

<script>
	import {
		toLogin
	} from "@/server/api.js";
	import {
		infoDetailsApi
	} from "@/server/config.js";
	
	import jyfParser from "@/components/jyf-parser/jyf-parser";

	export default {
		components: {
			jyfParser
		},
		onShow() {
			toLogin()
			this.fetchData()
		},
		onLoad(option) {
			this.id = option.id
		},
		data() {
			return {
				id: 0,
				title:'',
				summary:'',
				updateTime:null,
				topicdetaillength: 0,
				details: ''
			};
		},
		methods: {
			async fetchData() {
				let res = await infoDetailsApi(this.id)
				if (res.statusCode == 200) {
					this.title = res.data.title
					this.details = res.data.content.replace(
						/\<img/gi,
						'<img style="max-width:100%;height:auto;vertical-align: bottom;" '
					);
					this.summary = res.data.summary
					this.updateTime = res.data.updateTime
					this.topicdetaillength = this.details.length;
				}
			},
			replace:function(demo){
				return demo.replace('<o:p></o:p>','');
			},
		}
	};
</script>

<style lang='scss' scoped>
	@import "./style";
</style>
